<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
  <Link rel="stylesheet" type="text/css" href="style/style.css" />
  <script src="http://47.106.66.89:8080/js/vue.min.js"></script>
  <script src="http://47.106.66.89:8080/js/axios.min.js"></script>
  <link  href="http://47.106.66.89:8080/js/ele-2.15.7/theme-chalk/index.css" rel="stylesheet">
  <script src="http://47.106.66.89:8080/js/ele-2.15.7/index.js"></script>
  <script src="js/bbs.js"></script>
  <script src="js/ueditor-1.4.3.3/ueditor.config.js"></script>
  <script src="js/ueditor-1.4.3.3/editor_api.js"></script>

</head>
<body>
  <div id="app">
    <bbs>
      <el-form ref="form" label-width="80px" style="width:100%">
        <el-form-item label="板块">
          <el-cascader
                  v-model="topic.boardid"
                  :options="boards"
                  :props="{ expandTrigger: 'hover', value:'id', label:'boardname',emitPath:false }"
          ></el-cascader>
        </el-form-item>
        <el-form-item label="标题">
          <el-input v-model="topic.title"></el-input>
        </el-form-item>
        <el-form-item label="帖子内容">
          <!-- 加载编辑器的容器 -->
          <script id="container" name="content" type="text/plain">
            {{topic.title}}
          </script>
        </el-form-item>
            <el-button type="primary" @click="post">发帖</el-button>
            <el-button>取消</el-button>
      </el-form>
    </bbs>
  </div>

  <script>
  var v = new Vue({
  el : "#app",
  data : {
    topic:{},
    board:{},
    boards:{},
    us:null
  },
  created() {
  axios.get("tblBoard/queryById"+location.search).then(res=>{
  this.board=res.data;
  this.topic.boardid=this.board.id;
  });
    axios.get("tblBoard/query").then(res => {
      this.boards = res.data;
      this.boards.forEach(b=>{
        b.children.forEach(bb=>delete bb.children);
      })
    });
    this.ue = UE.getEditor('container');
  },
  methods : {
    post(){
      this.topic.content=this.ue.getContent()
      //json格式提交post请求
      axios.post("tblTopic/post",this.topic).then(res=>{
        if(res.data.code==1){
          this.$message=("发帖成功");
          location.href="list.html?bid="+this.topic.boardid;
        }else{
          this.$alert(res.data.msg);
        }
      });
    },
  }
  })
  </script>
</body>
</html>